<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/common/mytags.jsp"%>
<html>
<head>

<%@ include file="/common/easyui.jsp"%>
<%@ include file="/common/jquery-zTree.jsp"%>

<script type="text/javascript">

	$(document).ready(function() {
		//设置查询
		$.getJSON("${ctx}/adminManage/auto/autoDb/listForAjax.do", function(json) {
			var firstDbid;
			if(json.rows.length>0){
				firstDbid=json.rows[0].id;
				loadTreeList(firstDbid,json.rows[0].dbName);
			}
			$('#dbId').combogrid({
				data : json.rows,
				panelWidth : 500,
				idField:'id',
				textField:'dbName',
				value:firstDbid,
				editable:false,
				columns:[[
					{field : 'id',title : '主键',hidden:true},       
					{field : 'dbName',title : '数据库名'},
					{field : 'dbType',title : '类型'},
					{field : 'dbAccount',title : '账号'},
					{field : 'dbUrl',title : '地址'}
				]],
				onSelect:function(index,row){
					loadTreeList(row.id,row.dbName);
				}
			});
		});
	});
	
	function zTreeOnClick(event, treeId, treeNode) {
		loadList(treeNode.id,treeNode.className);
	};
	
	function loadTreeList(dbId,dbName) {
		$('#west').panel({'title':'表分类-'+dbName});
		//基础设置
		var setting = {
			/* data:{
				key:{
					name:'className'
				}
			}, */
			view: {
				nameIsHTML:true//名称支持html格式
				},
			callback:{
				onClick:zTreeOnClick
			}
		};
		//请求json
		$.getJSON("${ctx}/adminManage/auto/autoDbClass/listForAjax.do",{
			dbId:dbId,
			ifTreeList:1
		}, function(json) {
			//循环设置将所有的树默认打开
			var obj=json.rows;
			$.each(obj, function(i,item){
				item.name='['+item.selfNum+']'+item.className
				item.open=true;
				if(item.children!=null)
					iterative(item.children);
			});
			
			$.fn.zTree.init($("#treeDemo"), setting, obj);
			//单独选中根节点中第一个节点
			var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
            var nodes = treeObj.getNodes();
            treeObj.selectNode(nodes[0]);
			
			if(json.rows.length>0){
				loadList(json.rows[0].id,json.rows[0].className);
			}else{
				loadList("","");
			}
		});
	}
	
	//迭代设置节点是否打开
	function iterative(children){
		$.each(children, function(i,item){
			if(item.children!=null){
				item.name='['+item.selfNum+']'+item.className
				item.open=true;
				iterative(item.children);
			}	
		});
	} 

	function loadList(dbClassId,dbClassName) {
		$('#dataTable').treegrid({
			title:'数据库-'+dbClassName,
			loadMsg:'数据正在加载中...',
			idField : 'id',
			url : '${ctx}/adminManage/auto/autoDbTable/listForAjax.do',
			queryParams : {
					dbId : $('#dbId').combogrid('getValue'),
					dbClassId : dbClassId
				},
			columns : [[ 
						{field : 'id',title : '主键',hidden:true},
						{field : 'tableName',title : '表名称'},
						{field : 'tableComments',title : '表描述'},
						{field : 'className',title : '类名'},
						{field : 'templateId',title : '模板'},
						{field : 'tablePkNum',title : '主键数'},
						{field : 'tablePkName',title : '主键名'},
						{field : 'tablePkType',title : '主键类型'},
						{field : 'tablePkValue',title : '主键取值'}
					]],	
			fitColumns:true,
			pagination : false,	
			toolbar: '#tb',
			striped : true,
			singleSelect : true,
			rownumbers : true
		});
	}
	
	function doAdd() {
		$('#win').dialog({
			title:'新增表',
			//是否显示折叠按钮
			collapsible:false,
			width:700,
			height:450,
			modal:true ,
			content:'<iframe name=\"first\" scrolling=\"auto\" frameborder=\"0\" src=\"${ctx}/adminManage/auto/autoDbTable/autoDbTableAdd.jsp?dbId='+$('#dbId').combogrid('getValue')+'\" style=\"width:100%\;height:100%\;\"></iframe>'
		});  
	}

	function doUpdate() {
	}
	
	function doDelete() {
	}
	
</script>
</head>

<body class="easyui-layout">
<div region="north" title="数据库表管理" border="false" style="height: 60px">
	<div style="margin-left: 15px;margin-top: 5px">    
		所属数据库: <input id="dbId" class="easyui-combogrid" name="dbId" style="width:250px" />
    </div> 
</div>
<div region="west" id="west" title="数据库" border="false" style="width: 200px">
	<ul id="treeDemo" class="ztree"></ul>
</div>
<div region="center" border="false">
	<table id="dataTable" title="数据库表" style="width:100%;height:100%">
	</table>
	<!-- 查询条件和管理按钮 -->
	<div id="tb" style="padding:5px;height:auto"> 
	    <div style="margin-bottom:5px">    
	        <a class="easyui-linkbutton" plain="true" iconCls="icon-add" onclick="doAdd()">新增</a>    
	        <a class="easyui-linkbutton" plain="true" iconCls="icon-edit" onclick="doUpdate()">修改</a>    
	        <a class="easyui-linkbutton" plain="true" iconCls="icon-remove" onclick="doDelete()">删除</a>    
	    </div>    
	</div> 
</div>

<div id="win">
</div>
</body>
</html>